<%--
  Created by IntelliJ IDEA.
  User: user
  Date: 2024/6/20
  Time: 9:36
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
</head>
<body>
<button id="bt1">点击</button>
<div id="dv1"></div>
</body>
<script>
    var bt1=document.getElementById("bt1");
    bt1.onclick=function() {
        // 1、JavaScript内置工具类 XMLHttpRequest
        // 作用：实现基于浏览js环境的异步请求并接受相应的工具。
        // 创建ajax对象。
        var ajaxRequest = new XMLHttpRequest;
        // 2、常规方法：open、send
        ajaxRequest.open("GET", "https://autumnfish.cn/api/joke/list?num=3", true);
        ajaxRequest.send();
        // 3、常规属性：responseText，readyState，status
        // 4、常规事件：onreadystatechange
        ajaxRequest.onreadystatechange = function (reponse) {
            console.log(reponse)
            if (ajaxRequest.readyState == 4) {
                document.getElementById("dv1").innerHTML = ajaxRequest.responseText;
            }
        }
    }
        </script>
 </html>
